<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>个人信息</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/5.3.0/css/bootstrap.min.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light px-4">
    <a class="navbar-brand" href="#">图书管理网站</a>
    <div class="collapse navbar-collapse">
        <ul class="navbar-nav ms-auto">
            <li class="nav-item">
                <span class="nav-link">欢迎, <b th:text="${username}">用户名</b></span>
            </li>
            <li class="nav-item">
                <a class="nav-link" th:href="@{/logout}">注销</a>
            </li>
        </ul>
    </div>
</nav>

<div class="container mt-5">
    <h2>🙍‍♂️ 个人信息</h2>
    <ul class="list-group mt-3">
        <li class="list-group-item">用户名：<span th:text="${user.username}">user</span></li>
        <li class="list-group-item">角色：<span th:text="${user.role}">ROLE_USER</span></li>
        <li class="list-group-item">注册时间：<span th:text="${formattedCreateTime}">Time</span></li>
    </ul>

    <!-- 借阅记录（仅限用户） -->
    <div th:if="${user.role == 'USER'}" class="mt-5">
        <h4>📚 借阅记录</h4>
        <table class="table table-striped mt-3">
            <thead>
            <tr>
                <th>书名</th>
                <th>借阅时间</th>
                <th>归还时间</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <tr th:each="record : ${borrowRecords}">
                <td th:text="${record.bookTitle}">书名</td>
                <td th:text="${#dates.format(record.borrowTime, 'yyyy-MM-dd HH:mm')}">借阅时间</td>
                <td th:text="${record.returned != null ? #dates.format(record.returned, 'yyyy-MM-dd HH:mm') : '未归还'}">
                    归还时间
                </td>
                <td>
                    <form th:action="@{'/user/return/' + ${record.id}}" method="post">
                        <button type="submit" class="btn btn-sm btn-danger"
                                th:disabled="${record.returned != null}">
                            归还
                        </button>
                    </form>
                </td>
            </tr>

            <tr th:if="${#lists.isEmpty(borrowRecords)}">
                <td colspan="4">暂无借阅记录。</td>
            </tr>
            </tbody>
        </table>
    </div>

    <a class="btn btn-outline-primary mt-3" th:href="@{/index}">← 返回首页</a>
</div>
</body>
</html>
